<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>图书借阅平台—登录</title>
<link rel="stylesheet" href="webjars/layui/2.3.0/css/layui.css">
<script type="text/javascript" src="static/jquery-easyui-1.5.5.3/jquery.min.js"></script>
<script type="text/javascript" src="webjars/layui/2.3.0/layui.js"></script>
<script type="text/javascript" src="static/js/jzmm.js"></script>
<script type="text/javascript">
	layui.use('element', function() {
		var element = layui.element;
	});
	
	layui.use('form', function(){
	  	var form = layui.form;
	  
		form.on('submit(formDemo)', function(data){
		});
	});
	
	$(function(){
		var a = window.innerHeight - 60 + "px";
		$("#login").css('height', a);
	});
	$(window).resize(function(){
	    var a = window.innerHeight - 60 + "px";
		$("#login").css('height', a);
	});
</script>
<style type="text/css">
	body{
		background: url(static/img/login.jpg) no-repeat;
		background-size: cover;
	}
	#home{
		margin-top: 7%;
		margin-left: 60%;
		width: 400px;
		height: 400px;
		position: absolute;
		background: white;
	}
	#home h1{
		text-align: center; 
		fong-size: 24px; 
		font-family: '楷体'; 
		padding: 20px;
	}
	#home hr{
		width: 95%; 
		margin: 0 auto;
	}
</style>
</head>
<body>
	<ul class="layui-nav layui-bg-blue" style="padding-right: 50px;">
		<li class="layui-nav-item" style="text-align: left;">
			<a href="" style="font-size: 26px; font-family: '楷体';"><i class="layui-icon" style="font-size: 26px;">&#xe656;</i>  图书借阅平台</a>
		</li>
	  	<li class="layui-nav-item layui-this" style="float: right;">
	    	<a href=""><i class="layui-icon">&#xe612;</i> 登录</a>
	  	</li>
	  	<li class="layui-nav-item" style="float: right;">
	   	 	<a href=""><i class="layui-icon">&#xe613;</i> 关于我们</a>
	  	</li>
	  	<li class="layui-nav-item" style="float: right;">
	    	<a href="login"><i class="layui-icon">&#xe68e;</i> 首页</a>
	  	</li>
	</ul>
	
	<div id="login">
		<div id="home">
			<h1>登录</h1>
			<hr class="layui-bg-green">
			<form class="layui-form" id="loginForm" action="login" method="post" style="margin: 20px auto;">
				<center style="color: red;">
					<p data-th-if="${param.logout}">已成功注销</p>
					<p data-th-if="${param.error}">用户名或密码错误</p>
				</center><br>
				<div class="layui-form-item">
					<label class="layui-form-label">账号：</label>
					<div class="layui-input-inline">
						<input type="text" name="username" id="username" required lay-verify="required" placeholder="请输入账号" class="layui-input" />
					</div>
				</div><br>
				
				<div class="layui-form-item">
					<label class="layui-form-label">密码：</label>
					<div class="layui-input-inline">
						<input type="password" name="password" id="password" required lay-verify="required" placeholder="请输入密码" class="layui-input">
					</div>
				</div>
				
				<div class="layui-form-item">
					<div class="layui-input-block" id = "aaa">
					    <input type="checkbox" id="remember" title="记住密码">
				    </div>
				</div><br>
				
				<div class="layui-form-item layui-col-md-offset1">
			      	<button class="layui-btn" id="btn" lay-submit lay-filter="formDemo" style="width: 150px;">登录</button>
			      	<button type="reset" class="layui-btn layui-btn-primary" style="width: 150px;">重置</button>
				</div>
			</form>
		</div>
	</div>
</body>
</html>